/**
 * Dear programmer:
 * When I wrote this code, only god and I knew how it worked.
 * Now, only god knows it!
 *
 * @author: Pegasus  Date: 2018-12-13 Time: 22:23
 * OrderSweepScurrySave
 * 赶房 {"whsk_Order_Sweep":{"room":"0411","wuserid":"S03","iuserid":"S03","remark":"123456"}}
 */

import React, {Component} from 'react';
import {
    SafeAreaView,
    View,
    Text,
    Image,
    TouchableOpacity,
    ScrollView,
    FlatList,
    Modal, Platform, BackHandler, ToastAndroid, TextInput,
} from 'react-native';
import {connect} from 'react-redux';
import {styles} from './rmm_lose_add_screen.Style'
import DividingLineViewComponent from "../../../component/DividingLineViewComponent/DividingLineViewComponent";
import AntDesign from "react-native-vector-icons/AntDesign";
import FontAwesome from "react-native-vector-icons/FontAwesome"
import DatePicker from 'react-native-datepicker'
import {
    COLOR_FOCUS,
    COLOR_HEADER_END,
    COLOR_HEADER_START, COLOR_LINK,
    COLOR_THEME,
    FONT_COLOR_SUB_TITLE, FONT_COLOR_TITLE,
    FONT_SIZE_TITLE
} from "../../../constant/PHColors";
import BottomButtonView from "../../../component/BottomButtonView/BottomButtonView";
import {FetchStatus} from "../../../configuration/RequestConfiguration";
import {ReturnStatus} from "../../../configuration/ReturnStatus";
import {doDisplayWarnMessage} from "../../../component/Message/Action";
import {SCREEN_WIDTH} from "../../../constant/PHScreen";
import {hoLoseAdd} from "./Actions";
import User from "../../../model/User/User";

class rmm_lose_add extends Component {

    static navigationOptions = ({navigation}) => ({
        headerTitle: `添加遗留物品`,
    });

    // 构造
    constructor(props) {
        super(props);

        let date = new Date();
        let year = date.getFullYear().toString();
        let month = (date.getMonth()+1).toString();
        if(Number(month)<10){
            month = '0'+month
        }
        let day = date.getDate().toString();
        if(Number(day)<10){
            day = '0'+day
        }
        let opdate = year+'-'+month+'-'+day;

        let hour =  date.getHours().toString();
        if(Number(hour)<10){
            hour = '0'+hour
        }
        let minute = date.getMinutes().toString();
        if(Number(minute)<10){
            minute = '0'+minute
        }
        let nowTime = hour+':'+minute;

        // 初始状态
        this.state = {
            checked:require("../../../resource/login/dl_yixuan.png"),
            uncheck:require("../../../resource/login/dl_weixuan.png"),
            sp_date:opdate,
            sp_time:nowTime,
            grade:'0',
            lost_property:'',
            valus:'',
            collects:'',
            place:'',
            causation:'',
            speaker:'',
            remark:'',
            checkModalVisible:false,
        };

    }

    componentWillReceiveProps(nextProps, nextContext): void {
        let {dispatch} = this.props;

        if (nextProps.onHoLoseAdd !== this.props.onHoLoseAdd && nextProps.onHoLoseAdd.fetchStatus === FetchStatus.Success) {
            if (nextProps.onHoLoseAdd.RETURN === ReturnStatus.Success || nextProps.onHoLoseAdd.RETURN === 1 ) {
                this.props.navigation.navigate('rmm_lose');
                this.props.navigation.state.params.callBack()
            } else {
                dispatch(doDisplayWarnMessage(nextProps.onHoLoseAdd.MSG))
            }
        }
    }

    // 组件渲染后调用
    componentDidMount() {
        let {dispatch} = this.props;
        let username = '';
        User.getUser(user => {
            username = user.username;
            this.setState({speaker: username})

        });

    }

    render() {
        let {dispatch} = this.props;
        return (
            <SafeAreaView style={styles.body}>
                <ScrollView style={styles.body}>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    等级
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <TouchableOpacity activeOpacity={0.8} onPress={() => {
                                    this.setState({
                                        grade:'0',
                                    })
                                }}>
                                    <View style={{flexDirection: 'row', justifyContent: 'center', alignItems: 'center'}}>

                                        {
                                            (this.state.grade)==='0'?
                                                (
                                                    <Image style={{width: 18, height: 18}} source={require("../../../resource/login/dl_yixuan.png")}/>
                                                )
                                                :
                                                (
                                                    <Image style={{width: 18, height: 18}} source={require("../../../resource/login/dl_weixuan.png")}/>
                                                )
                                        }
                                        <Text style={{fontSize: 16, marginLeft: 5}}>
                                            普通
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                                <TouchableOpacity activeOpacity={0.8} onPress={() => {
                                    this.setState({
                                        grade:'1',
                                    })
                                }}>
                                    <View style={{marginLeft:10,flexDirection: 'row', justifyContent: 'center', alignItems: 'center'}}>

                                        {
                                            (this.state.grade)==='1'?
                                                (
                                                    <Image style={{width: 18, height: 18}} source={require("../../../resource/login/dl_yixuan.png")}/>
                                                )
                                                :
                                                (
                                                    <Image style={{width: 18, height: 18}} source={require("../../../resource/login/dl_weixuan.png")}/>
                                                )
                                        }
                                        <Text style={{fontSize: 16, marginLeft: 5}}>
                                            贵重
                                        </Text>
                                    </View>
                                </TouchableOpacity>
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    失物
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <TextInput
                                    placeholder={'失物'}
                                    style={{
                                        fontSize: 16,
                                        padding: 0,
                                        color:(this.state.lost_property===""||typeof (this.state.lost_property)==='undefined')?'#f1f1f1':'#000000',
                                    }}
                                    numberOfLines={1}
                                    underlineColorAndroid={'transparent'}
                                    onChangeText={text=>{
                                        this.setState({lost_property: text})
                                    }}
                                    defaultValue = {this.state.lost_property}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    估价
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <TextInput
                                    placeholder={'估价'}
                                    style={{
                                        fontSize: 16,
                                        padding: 0,
                                        color:(this.state.valus===""||typeof (this.state.valus)==='undefined')?'#f1f1f1':'#000000',
                                    }}
                                    numberOfLines={1}
                                    underlineColorAndroid={'transparent'}
                                    onChangeText={text=>{
                                        this.setState({valus: text})
                                    }}
                                    defaultValue = {this.state.valus}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    拾物人
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <TextInput
                                    placeholder={'拾物人'}
                                    style={{
                                        fontSize: 16,
                                        padding: 0,
                                        color:(this.state.collects===""||typeof (this.state.collects)==='undefined')?'#f1f1f1':'#000000',
                                    }}
                                    numberOfLines={1}
                                    underlineColorAndroid={'transparent'}
                                    onChangeText={text=>{
                                        this.setState({collects: text})
                                    }}
                                    defaultValue = {this.state.collects}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    拾物地点
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <TextInput
                                    placeholder={'拾物地点'}
                                    style={{
                                        fontSize: 16,
                                        padding: 0,
                                        color:(this.state.place===""||typeof (this.state.place)==='undefined')?'#f1f1f1':'#000000',
                                    }}
                                    numberOfLines={1}
                                    underlineColorAndroid={'transparent'}
                                    onChangeText={text=>{
                                        this.setState({place: text})
                                    }}
                                    defaultValue = {this.state.place}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    事由
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <TextInput
                                    placeholder={'事由'}
                                    style={{
                                        fontSize: 16,
                                        padding: 0,
                                        color:(this.state.causation===""||typeof (this.state.causation)==='undefined')?'#f1f1f1':'#000000',
                                    }}
                                    numberOfLines={1}
                                    underlineColorAndroid={'transparent'}
                                    onChangeText={text=>{
                                        this.setState({causation: text})
                                    }}
                                    defaultValue = {this.state.causation}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    报告人
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <TextInput
                                    placeholder={'报告人'}
                                    style={{
                                        fontSize: 16,
                                        padding: 0,
                                        color:(this.state.speaker===""||typeof (this.state.speaker)==='undefined')?'#f1f1f1':'#000000',
                                    }}
                                    numberOfLines={1}
                                    underlineColorAndroid={'transparent'}
                                    onChangeText={text=>{
                                        this.setState({speaker: text})
                                    }}
                                    defaultValue = {this.state.speaker}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    报告日期
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <DatePicker
                                    style={{width: 120,alignItems:'flex-end'}}
                                    date={this.state.sp_date}
                                    showIcon={false}
                                    mode="date"
                                    placeholder="请选择"
                                    format={"YYYY-MM-DD"}
                                    confirmBtnText="确定"
                                    cancelBtnText="取消"
                                    customStyles={{
                                        dateIcon: {
                                            position: 'absolute',
                                            left: 0,
                                            top: 4,
                                            marginLeft: 0
                                        },
                                        dateInput: {
                                            marginLeft: 36,
                                            borderWidth: 0,
                                            fontSize:16,
                                            marginRight: 0,
                                            alignItems:'flex-end',
                                        }
                                    }}
                                    onDateChange={(date) => {this.setState({sp_date: date})}}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>

                    <View style={{backgroundColor: '#FFF'}}>
                        <View style={styles.itemHeader}>
                            <View style={styles.itemHeaderLeft}>
                                <Text style={styles.itemHeaderText}>
                                    报告时间
                                </Text>
                            </View>
                            <View style={styles.itemHeaderRight}>
                                <DatePicker
                                    style={{width: 120,alignItems:'flex-end'}}
                                    date={this.state.sp_time}
                                    showIcon={false}
                                    mode="time"
                                    placeholder="请选择"
                                    format={"HH:mm"}
                                    confirmBtnText="确定"
                                    cancelBtnText="取消"
                                    customStyles={{
                                        dateIcon: {
                                            position: 'absolute',
                                            left: 0,
                                            top: 4,
                                            marginLeft: 0
                                        },
                                        dateInput: {
                                            marginLeft: 36,
                                            borderWidth: 0,
                                            fontSize:16,
                                            marginRight: 0,
                                            alignItems:'flex-end',
                                        }
                                    }}
                                    onDateChange={(date) => {this.setState({sp_time: date})}}
                                />
                            </View>
                        </View>
                    </View>

                    <DividingLineViewComponent lineHeight={10}/>
                    {
                        <View style={{backgroundColor: '#FFF'}}>
                            <View style={styles.itemHeader}>
                                <View style={styles.itemHeaderLeft}>
                                    <Text style={styles.itemHeaderText}>
                                        备注
                                    </Text>
                                </View>
                                <View style={styles.itemHeaderRight}>
                                    <Text style={{fontSize: 16, color: FONT_COLOR_SUB_TITLE}}>
                                        {this.state.remark.length}
                                        <Text style={{fontSize: 16, color: FONT_COLOR_SUB_TITLE}}>
                                            /100
                                        </Text>
                                    </Text>
                                </View>
                            </View>

                            <DividingLineViewComponent lineHeight={1}/>

                            <View style={{margin: 15, height: 120}}>
                                <TextInput
                                    placeholder={'点击输入备注内容'}
                                    multiline={true}
                                    maxLength={100}
                                    style={{
                                        fontSize: 16,
                                        padding: 0,
                                        height:120,
                                        textAlignVertical: "top",
                                        lineHeight:25,
                                    }}
                                    underlineColorAndroid={'transparent'}
                                    onChangeText={text => {
                                        if(text.length>100){
                                            text = text.substring(0,100)
                                        }
                                        this.setState({
                                            remark:text,
                                        })
                                    }}
                                />
                            </View>
                        </View>
                    }



                </ScrollView>

                <BottomButtonView title={'保存'} onSubmitClick={() => {
                    this._onCheck()
                }}/>

                <Modal visible={this.state.checkModalVisible} animationType = {'none'} transparent = {true} onRequestClose={()=> this.onRequestClose()} >
                    <View style={styles.modalContainer} onPress={()=> this.onRequestClose()}>
                        <View style={styles.checkModalBody}>
                            <View style={styles.checkModalHeader}>
                                <Text style={styles.checkModalHeaderText}>
                                    确认保存？
                                </Text>
                            </View>
                            <View style={styles.checkModalCenter}>
                                <TouchableOpacity  style={styles.checkModalCenterLeft} onPress={()=>{
                                    this.setState({
                                        checkModalVisible:false,
                                    })
                                }}>
                                    <Text style={{color:'black'}}>
                                        取消
                                    </Text>
                                </TouchableOpacity>
                                <TouchableOpacity style={styles.checkModalCenterRight} onPress={()=>{
                                    this.setState({
                                        checkModalVisible:true,
                                    })
                                    this._onSubmitClick()
                                }}>
                                    <Text style={{color:'white'}}>
                                        保存
                                    </Text>
                                </TouchableOpacity>
                            </View>
                        </View>
                    </View>
                </Modal>
            </SafeAreaView>
        )
    }

    //检查数据格式
    _onCheck=()=>{
        this.setState({
            checkModalVisible:true,
        })
    };

    //确认提交
    _onSubmitClick=()=>{

        let str = {"ho_lose":{}}
        str.ho_lose.status = "1";
        str.ho_lose.grade = this.state.grade;
        str.ho_lose.lost_property = this.state.lost_property;
        str.ho_lose.valus = this.state.valus;
        str.ho_lose.collects = this.state.collects;
        str.ho_lose.place = this.state.place;
        str.ho_lose.causation = this.state.causation;
        str.ho_lose.speaker = this.state.speaker;
        str.ho_lose.bewrite = this.state.remark;
        str.ho_lose.sp_time = this.state.sp_time;


        let reg = new RegExp("-","g");
        let sp_date =(this.state.sp_date.replace(reg,""));
        str.ho_lose.sp_date = sp_date;

        console.log(JSON.stringify(str))

        let {dispatch} = this.props;
        dispatch(hoLoseAdd(JSON.stringify(str)))


    }

}

const props = state => {
    return {
        onHoLoseAdd:state.onHoLoseAdd
    }
}

export default rmm_lose_add = connect(props)(rmm_lose_add);